<template>
  <view class="my-company">
    <!-- 公司信息 -->
    <view class="company-info">
      <view class="info-item">
        <text class="label">公司规模</text>
        <text class="value">0-20</text>
      </view>
      <view class="info-item">
        <text class="label">融资阶段</text>
        <text class="value">A轮</text>
      </view>
      <view class="info-item">
        <text class="label">所属行业</text>
        <text class="value">计算机服务</text>
      </view>
    </view>

    <!-- 操作按钮 -->
    <view class="action-buttons">
      <view class="button leave-company" @click="showLeaveCompanyModal">
        <text>离开公司</text>
      </view>
      <view class="button change-company" @click="changeCompany">
        <text>更换公司</text>
      </view>
    </view>

    <!-- 自定义弹窗 -->
    <custom-modal
      :visible="showModal"
      @cancel="hideModal"
      @confirm="handleConfirm">
	   <view class="popup-content">
		  <text class="title">离开公司可能造成影响</text>
		  <text>·注销招聘者身份（后续可重新认证）</text>
		  <text>·发布中的职位会被关闭</text>
		</view>
	</custom-modal>
  </view>
</template>

<script>
import CustomModal from "@/components/custom-modal.vue";

export default {
  components: {
    CustomModal,
  },
  data() {
    return {
      showModal: false, // 控制弹窗显示
    };
  },
  methods: {
    // 显示自定义弹窗
    showLeaveCompanyModal() {
      this.showModal = true;
    },
    // 隐藏自定义弹窗
    hideModal() {
      this.showModal = false;
    },
    // 确认离开公司
    handleConfirm() {
      this.showModal = false;
      uni.showToast({
        title: "已提交离开公司申请",
        icon: "none",
      });
    },
    // 更换公司
    changeCompany() {
      uni.navigateTo({ url: "/pages/form/company-info/change-company" });
    },
  },
};
</script>

<style scoped>
/* 原有样式保持不变 */
.my-company {
  padding: 20px;
  font-family: Arial, sans-serif;
  background-color: #fff;
}

.company-info {
  margin-bottom: 40px;
}

.info-item {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  margin-bottom: 15px;
}

.label {
  font-size: 14px;
  color: #000;
}

.value {
  color: #999;
  text-align: center;
  font-size: 12px;
  line-height: 20px; /* 166.667% */
}

.action-buttons {
  display: flex;
  justify-content: space-between;
}

.button {
  flex: 1;
  padding: 10px;
  border-radius: 4px;
  text-align: center;
  cursor: pointer;
  background-color: #ddd;
  color: #333;
  text-align: center;
  font-size: 15px;
}

.leave-company {
  margin-right: 20px;
}

/* 弹窗内容样式 */
.popup-content {
	  background-color: #fff; /* 调试用 */
	  padding: 10px; /* 确保内容有足够的空间 */
  white-space: pre-line; /* 允许 \n 换行 */
}

.popup-content text {
  color: #4E5969;
  display: block; /* 每个 <text> 独占一行 */
  margin-bottom: 5px; /* 调整行间距 */
  font-size: 10px;
}

.popup-content .title{
	color: #141414;
	font-size: 12px;
}
</style>